<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>河南城建工业大数据平台</title>
    <!-- Font Awesome Icons -->
    <link rel="stylesheet" href="{{STATIC_URL}}plugins/fontawesome-free/css/all.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="{{STATIC_URL}}dist/css/adminlte.min.css">
    <link rel="stylesheet" href="{{STATIC_URL}}font-awesome/css/font-awesome.css">
    <!-- Google Font: Source Sans Pro -->
    <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
    <!-- 我的css和js -->
    <link href="{{STATIC_URL}}css/playground.css" media="all" rel="stylesheet" type="text/css" />
{#    <link href="//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">#}
    <style>
        #container{
            padding: 0;
            margin: 0;
            border: 0;
        }
    </style>

</head>
<body class="hold-transition sidebar-mini" style="overflow:-Scroll; overflow-x:hidden; overflow-y:hidden;">
    <!-- map -->

    <!-- jQuery -->
{#    <script src="{{STATIC_URL}}plugins/jquery/jquery.min.js"></script>#}
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <!-- Bootstrap 4 -->
    <script src="{{STATIC_URL}}plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
    <!-- AdminLTE App -->
    <script src="{{STATIC_URL}}dist/js/adminlte.min.js"></script>
    <!-- 设备 -->
{#    <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.2.1/echarts-en.common.min.js" type="text/javascript" charset="utf-8"></script>#}
{#    <script src="{{STATIC_URL}}dist/js/echarts-4.2.1.min.js"></script>#}
    <script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
{#    <script src="{{STATIC_URL}}dist/js/monitor.js"></script>#}
{#    <script src="{{STATIC_URL}}js/fullscreen.js"></script>#}
{#    <script src="{{STATIC_URL}}js/localFullScreen.js"></script>#}
{#    <script src="{{STATIC_URL}}js/echarts.min.js"></script>#}
{#<div id="back">#}
    <div class="wrapper">
        <!-- Navbar -->
        <nav class="main-header navbar navbar-expand navbar-white navbar-light">
            <!-- Left navbar links -->
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" data-widget="pushmenu" href="#"><i class="fas fa-bars"></i></a>
                </li>
                <li class="nav-item d-none d-sm-inline-block">
                    <a href="/" class="nav-link">Home</a>
                </li>
{#                <li class="nav-item d-none d-sm-inline-block">#}
{#                    <a href="#" class="nav-link">Contact</a>#}
{#                </li>  // 上方导航栏弃用部分#}
            </ul>
            <!-- SEARCH FORM -->
{#            <form class="form-inline ml-3">#}
{#                <div class="input-group input-group-sm">#}
{#                    <input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">#}
{#                    <div class="input-group-append">#}
{#                        <button class="btn btn-navbar" type="submit">#}
{#              <i class="fas fa-search"></i>#}
{#            </button>#}
{#                    </div>#}
{#                </div>#}
{#            </form>  // 上方导航栏弃用部分(搜索框)#}
            <!-- Right navbar links -->
            <ul class="navbar-nav ml-auto">
                <!-- Notifications Dropdown Menu -->
                <li class="nav-item dropdown">
                    <a class="nav-link" data-toggle="dropdown" href="#">
                        <i class="far fa-bell"></i>
                        <span class="badge badge-warning navbar-badge">15</span>
                    </a>
                    <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
                        <span class="dropdown-header">15 Notifications</span>
                        <div class="dropdown-divider"></div>
                        <a href="#" class="dropdown-item">
                            <i class="fas fa-file mr-2"></i> 3 new reports
                            <span class="float-right text-muted text-sm">2 days</span>
                        </a>
                        <div class="dropdown-divider"></div>
                        <a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
                    </div>
                </li>

                {% if user.is_authenticated %}
                <li class="nav-item"><a class="nav-link">您好, {{ user.username }}.</a></li>
                <li class="nav-item"><a class="nav-link" href="{% url 'users:logout' %}">退出系统</a></li>
                {% else %}
                <li class="nav-item"><a class="nav-link" href="{% url 'users:register' %}">注册</a></li>
                <li class="nav-item"><a class="nav-link" href="{% url 'users:login' %}">登录</a></li>
                {% endif %}
            </ul>
        </nav>
        <!-- /.navbar -->
        <!-- Main Sidebar Container -->
        <aside class="main-sidebar sidebar-dark-primary elevation-4" style='top: 0px; ! important;'>
            <!-- Brand Logo -->
            <a href="/" class="brand-link" style="padding-bottom: 20px; padding-top: 23px;">
                <img src="{{STATIC_URL}}dist/img/AdminLTELogo.png" alt="AdminLTE Logo" class="brand-image img-circle elevation-3" style="opacity: .8">
                <span class="brand-text font-weight-light"><strong>Industrial Platform</strong></span>
            </a>
            <!-- Sidebar -->
            <div class="sidebar">
                <!-- Sidebar user panel (optional) -->
                <!-- Sidebar Menu -->
                <nav class="mt-2">
                    <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
                        <!-- Add icons to the links using the .nav-icon class
               with font-awesome or any other icon font library -->
                        <li class="nav-item">
                            <a href="{% url 'Industrial_Logs:topics' %}" class="nav-link active">
                                <i class="nav-icon fas fa-tachometer-alt"></i>
                                <p>
                                    仪表盘
                                    <span class="right badge badge-danger" id="btn" onclick="btnClick(event);" >显示</span>
                                </p>
                            </a>
                        </li>

                        <li class="nav-item has-treeview menu-open">
                            <a href="#" class="nav-link ">
                                <i class="fa fa-microchip nav-icon"></i>
                                <p>
                                    传感器
                                    <i class="right fas fa-angle-left"></i>
                                </p>
                            </a>
{#                            <ul class="nav nav-treeview">#}
{#                                <li class="nav-item">#}
{#                                    <a href="{% url 'Industrial_Logs:BME280' %}" class="nav-link ">#}
{#                                        <!-- 添加active类菜单高亮 -->#}
{#                                        <i class="far fa-circle nav-icon"></i>#}
{#                                        <p>BME280</p>#}
{#                                    </a>#}
{#                                </li>#}
{##}
{#                            </ul>#}
{#                            <ul class="nav nav-treeview">#}
{#                                <li class="nav-item">#}
{#                                    <a href="{% url 'Industrial_Logs:SDS011' %}" class="nav-link ">#}
{#                                        <!-- 添加active类菜单高亮 -->#}
{#                                        <i class="far fa-circle nav-icon"></i>#}
{#                                        <p>SDS011</p>#}
{#                                    </a>#}
{#                                </li>#}
{##}
{#                            </ul>#}
                            <ul class="nav nav-treeview">
                                <li class="nav-item">
                                    <a href="{% url 'Industrial_Logs:Sensor_Proportion' %}" class="nav-link ">
                                        <!-- 添加active类菜单高亮 -->
{#                                        <i class="fa fa-pie-chart"></i>#}
                                        <i class="fa fa-pie-chart nav-icon"></i>
                                        <p>传感器位置</p>
                                    </a>
                                </li>

                            </ul>

                        </li>

                        <li class="nav-item has-treeview menu-open">
                            <a href="#" class="nav-link ">
                                <i class="fa fa-sitemap nav-icon"></i>
                                <p>
                                    Hadoop平台
                                    <i class="right fas fa-angle-left"></i>
                                </p>
                            </a>
                            <ul class="nav nav-treeview">
                                <li class="nav-item">
                                    <a href="{% url 'Industrial_Logs:hadoop_info' %}" class="nav-link ">
                                        <!-- 添加active类菜单高亮 -->
                                        <i class="fa fa-file nav-icon"></i>
                                        <p>Hadoop平台信息</p>
                                    </a>
                                </li>


                            </ul>

                        </li>

                        <li class="nav-item has-treeview menu-open" >
                            <a href="#" class="nav-link ">
                                <i class="fa fa-industry nav-icon"></i>
                                <p>
                                    历史数据分析
                                    <i class="right fas fa-angle-left"></i>
                                </p>
                            </a>
                            <ul class="nav nav-treeview">
                                <li class="nav-item">
                                    <a href="{% url 'Industrial_Logs:BME280' %}" class="nav-link ">
                                        <!-- 添加active类菜单高亮 -->
                                        <i class="fa fa-bar-chart nav-icon"></i>
                                        <p>压力/温湿度/PM（同比）</p>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="{% url 'Industrial_Logs:PTH_PM' %}" class="nav-link ">
                                        <!-- 添加active类菜单高亮 -->
                                        <i class="fa fa-area-chart nav-icon"></i>
                                        <p>温湿度-PM/压力</p>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="{% url 'Industrial_Logs:P_TH' %}" class="nav-link ">
                                        <!-- 添加active类菜单高亮 -->
                                        <i class="fa fa-thermometer-three-quarters nav-icon"></i>
                                        <p>压力/温湿度/PM（环比）</p>
                                    </a>
                                </li>

                            </ul>

                        </li>

{#                        <li class="nav-item has-treeview menu-open">#}
{#                            <a href="#" class="nav-link ">#}
{#                                <i class="nav-icon fas fa-tachometer-alt"></i>#}
{#                                <p>#}
{#                                    系统管理#}
{#                                    <i class="right fas fa-angle-left"></i>#}
{#                                </p>#}
{#                            </a>#}
{##}
{#                            <ul class="nav nav-treeview">#}
{#                                <li class="nav-item">#}
{#                                    <a href="{% url 'Industrial_Logs:realdev_tem' %}" class="nav-link ">#}
{#                                        <!-- 添加active类菜单高亮 -->#}
{#                                        <i class="far fa-circle nav-icon"></i>#}
{#                                        <p>用户管理</p>#}
{#                                    </a>#}
{#                                </li>#}
{##}
{#                            </ul>#}
{#                        </li>#}
                        <li class="nav-item has-treeview menu-open">
                             <a href="{% url 'Industrial_Logs:realTemAndHum' 100 %}" class="nav-link ">
                                <i class="fa fa-line-chart nav-icon"></i>
                                <p>

                                    实时数据展示
{#                                    <i class="right fas fa-angle-left"></i>#}
                                </p>
                            </a>
{#                            <ul class="nav nav-treeview">#}
{#                                <li class="nav-item">#}
{#                                    <a href="{% url 'Industrial_Logs:realTemAndHum' %}?dev_id=100" class="nav-link ">#}
{#                                        <!-- 添加active类菜单高亮 -->#}
{#                                        <i class="fa fa-line-chart"></i>#}
{#                                        <p>温湿度实时数据</p>#}
{#                                    </a>#}
{#                                </li>#}
{##}
{#                            </ul>#}

                        </li>

                    </ul>
                </nav>
                <!-- /.sidebar-menu -->
            </div>
            <!-- /.sidebar -->
        </aside>


        <!-- Content Wrapper. Contains page content -->
        <div class="content-wrapper">
            <!-- Main content -->
            <div class="content" >
                <div id="container" ondblclick="fullScreen(this);" class="container-fluid">
                    {% block header %} {% endblock header %} {%block content%} {%endblock%}
                </div>
                <!-- /.container-fluid -->
            </div>
            <!-- /.content -->
        </div>
        <!-- /.content-wrapper -->
        <!-- Main Footer -->
        <footer class="main-footer">
            <!-- To the right -->

            <!-- Default to the left -->
            <strong>Copyright &copy; 2020 All rights reserved.</strong>
    </footer>
  </div>
{#</div>#}

  <!-- ./wrapper -->
<script>
        function btnClick(event) {
            event.preventDefault();
    　　  var elem = document.getElementById("container");
    　　fullScreen(elem);
        }
    function fullScreen(element) {
        if(element.requestFullScreen) {
            element.requestFullScreen();
        }else if(element.webkitRequestFullScreen ) {
            element.webkitRequestFullScreen();
        }else if(element.mozRequestFullScreen) {
            element.mozRequestFullScreen();
        }
    }
    </script>
</body>

</html>